<template>
	<public-view navType="other" navTitle="领取记录">
		<view class="content">
			<block v-for="(item, index) in list" :key="index">
				<view class="logitem flex j-c-b a-i-c">
					<view class="left flex f-d-c">
						<view class="f-s-28 name f-w-b">
							{{item.goods_gift?.name||""}}
						</view>
						<view class="end-time color-878787 f-s-24">
							截止时间：{{getTime(item.goods_gift?.end_time)}}
						</view>
					</view>
					<view class="right color-EE8300 f-s-26" v-if="item.status === 0" @click="goTo({url:'/pages/my/giftGetInfo?id='+item.id})">
						去领取
					</view>
					<view class="right color-959595 f-s-26" v-if="item.status === 1">
						已领取
					</view>
					<view class="right color-959595 f-s-26" v-if="item.status === 2">
						已过期
					</view>
				</view>
			</block>
		</view>
	</public-view>
</template>

<script>
	import {goTo} from "@/nav.js"
	export default {
		data() {
			return {
				list:[],
				page:1
			};
		},
		onLoad() {
			this.getMyGiftList()
		},
		onReachBottom() {
			this.page++
			this.getMyGiftList()
		},
		methods:{
			goTo,
			getTime(d){
				let date = new Date(d*1000)
				let yyyy = date.getFullYear()
				let MMMM =  date.getMonth()+1<10?`0${date.getMonth()+1}`:date.getMonth()+1
				let dd = date.getDate()<10?`0${date.getDate()}`:date.getDate()
				let hh = date.getHours()<10?`0${date.getHours()}`:date.getHours()
				let mm = date.getMinutes()<10?`0${date.getMinutes()}`:date.getMinutes()
				return  `${yyyy}-${MMMM}-${dd} ${hh}:${mm}`
			},
			getMyGiftList(){
				let that = this
				that.util.postRequest({
					url:"v1/goods_gift_user/index",
					data:{
						page:that.page,
						rows:10
					}
				}).then(res=>{
					console.log(res)
					if(that.page === 1){
						that.list = res.data.data
					}else{
						if(res.data.data.length>0){
							that.list = that.list.concat(res.data.data)
						}else{
							that.page--
						}
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.logitem{
		width: 100%;
		padding: 36upx 38upx;
		background: #FFFFFF;
		border-radius: 16upx;
		margin-bottom: 20upx;
		.right{
			position: relative;
			.dots{
				width: 8upx;
				height: 8upx;
				background: #EE8300;
				position: absolute;
				z-index: 2;
				top: 0;
				right: 0;
			}
		}
		.left{
			.name{
				line-height: 40upx;
				margin-bottom: 30upx;
			}
		}
	}
	.content{
		width: 750upx;
		padding: 34upx 40upx;
	}
</style>
